<template>
	<view>
		<view v-for="(item,index) in 10" class="flex align-center padding bg-fff">
			<text class="iconfont icon-gouxuan margin-right active"></text>
			<image class="poster margin-right-sm" src="../../static/img/recommend2.jpg" mode=""></image>
			<view class="info">
				<view class="flex justify-between">
					<view class="">
						<view class="">
							草莓蛋糕
						</view>
						CaoMei DanGao
					</view>
					<view class="edit">
						<text class="iconfont icon-bianji"></text>
					</view>
				</view>
				<view class="flex justify-between margin-top">
					<view class="">
						￥218
					</view>
					<view class="">
						1磅 x 2
					</view>
				</view>
			</view>
			
		</view>
		<view class="flex align-center justify-between my-fixed-bottom bg-fff my-shadow">
			<view>
				<text class="iconfont icon-gouxuan margin-lr"></text>
				合计:3000元
			</view>
			<view class="padding bg-yellow">
				立即结算
			</view>
		</view>
	</view>
</template>

<script>
	import {mapState} from 'vuex'
	export default {
		data() {
			return {
				
			}
		},
		computed: {
			...mapState({
				userInfo:state=>state.user.userInfo
			})
		},
		onLoad() {
			if(!this.userInfo){
				uni.showModal({
					title:'请登录后再操作',
					content:'登录以便为您提供更好的服务!',
					cancelText:'稍后再说',
					confirmText:'立即登录',
					success:({confirm})=>{
						if(confirm){
							uni.navigateTo({
								url:'../my/login'
							})
							return
						}
						uni.navigateBack({
							delta:1
						})
					}
				})
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss">
.poster{
	width: 200upx;
	height: 200upx;
}
.info{
	flex: 1;
}
.edit{
	height: 60upx;
	width: 60upx;
	background-color: #d8d8d8;
	text-align: center;
	line-height: 60upx;
	border-radius: 50%;
}
.icon-gouxuan.active{
	color: #FAE456;
}
</style>
